/* CSS Document */
section{ background-color:#fff;}
.app-top-content{width:100%; background-color:#fff;}
.app-top{ position:relative; padding:50px 0 10px 0; width:900px; margin:0 auto;}
.a-t-r{padding:160px 0 0 0; width:400px;}
.a-t-logo{ font-size:46px; color:#999999; padding-bottom:10px;}
.a-t-logo img{ vertical-align:middle; padding-right:20px;}
.a-t-logo span{ letter-spacing:10px; line-height:46px;}
.a-ewm{ position:relative; padding-right:40px;}
.a-ewm span{ position:absolute; right:-20px; top:-22px;}
.a-t-txt{ font-size:18px; line-height:30px; color:#999; padding:15px 0 35px 0;}
.a-t-txt2{ color:#ee0066; padding-top:30px;}
.DownBtnInfo a{ display:inline-block; border:2px solid #ee0066; color:#ee0066; padding:5px 5px 5px 34px; font-size:16px; line-height:36px; border-radius:4px; -webkit-border-radius:4px; margin-right:15px;}
.DownAndroid{ background:url(../images/zkapp/icon-android.png) no-repeat 5px center;}
.DownIos{ background:url(../images/zkapp/icon-ios.png) no-repeat 5px center;}

.app-banner{ background-color:#eeeeee; padding:80px 0; text-align:center;}
.a-b-title{ font-size:36px; line-height:36px; padding-bottom:15px; color:#9c9c9c; font-weight:bold;}
.a-b-txt{ width:490px; color:#4b4b4b; margin:0 auto;}

.app-content { position:relative; padding-top:40px; }
.app-content ul{ width:1160px; margin:0 auto;}
.app-content ul li{ width:50%; float:left;}
.size-left{ text-align:right;}
.size-title{ color:#626262; font-size:18px; width:400px; padding-left:180px; line-height:24px;}
.size-txt{ color:#626262; font-size:14px;}
.right-img1{ position:absolute; right:0; top:40px; width:300px; height:398px; overflow:hidden;}


.size-right{}
.size-title2{ color:#626262; font-size:18px; width:400px; line-height:24px;}

.app-texiao{width:45%; min-width:480px; position:relative; height:50px;}
.app-texiao div{ position:absolute;}
.htiao1{ height:3px; width:300px; background-color:#ee0066; font-size:0; line-height:0; right:50px; top:12px;}
.htiao2{height: 3px;width: 90%;	min-width: 440px;background-color: #ee0066;font-size: 0;line-height: 0;	right: 40px;top: 19px;}
.cicle1{top: 36px;right: 391px;}
.cicle2{top: -37px;right: 320px;}
.cicle3{top: -7px;right: 239px;}
.cicle4{top: 21px;right: 160px;}
.cicle5{top: 31px;right: 92px;}
.cicle6{top: -38px;	right: 28px;}

.htiao1_2{ height:3px; width:300px; background-color:#ee0066; font-size:0; line-height:0; left:50px; top:12px;}
.htiao2_2{height: 3px;width: 90%;	min-width: 440px;background-color: #ee0066;font-size: 0;line-height: 0;	left: 40px;top: 19px;}
.man1{left: 228px;top: -84px;}
.man2{left: 180px;top: -94px; width:46px; text-align:center;}
.man3{left: 118px;top: -79px;}
.star1{left: 80px;top: -26px; text-align:center; width:28px; height:26px;}
.star2{left: 281px;top: -6px; text-align:center; width:18px; height:17px;}
.star3{left: 270px;top: -103px; text-align:center; width:18px; height:17px;}

.navInfo{ position:relative; height:480px;}
.navInfo a{ position:absolute; display:inline-block;}
.iphoneimg4{ position:absolute; left:157px; z-index:2;}
.iphoneimg4btm{ position:absolute; left:30px; bottom:15px; z-index:0;}
.navimg1{
	left: 419px;
	top: 70px;
}
.navimg2{
	left: 359px;
	top: 139px;
}
.navimg3{
	left: 416px;
	top: 210px;
}
.navimg4{
	left: 383px;
	top: 287px;
}
.navimg5{
	left: 268px;
	top: 302px;
	z-index:3;
}
.navimg6{
	left: 154px;
	top: 322px;
	z-index:3;
}
.navimg7{
	left: 42px;
	top: 254px;
}
.navimg8{
	left: 10px;
	top: 168px;
}
.navimg9{
	left: 74px;
	top: 113px;
}

.f-top{ height:2px; background-color:#ee0066; font-size:0; line-height:0; position:relative; margin-top:50px; margin-bottom:22px;}
.size4{ background-color:#fff; padding:0 20px; position:absolute; left:50%; top:-24px; margin-left:-90px;}
.smile{ position:absolute; left:50%; top:-45px; margin-left:95px;}
.f-content{ padding:25px 0; background-color:#333;}
.f-txt{ text-align:center; font-size:18px; color:#eee;}
.f-txt span{ color:#fff; display:inline-block; padding-right:15px;}
.AndroidBtn2{ display:block; position:absolute; left:50%; margin-left:-145px; padding:8px 10px 8px 35px; width:90px; color:#fefefe; font-size:14px; background:url(../images/zkapp/icon-android2.png) no-repeat 8px center; border:solid 1px #fff; border-radius:4px;  -webkit-border-radius:4px; text-align:right}
.IosBtn2{ display:block; position:absolute; left:50%; margin-left:-145px; padding:8px 10px 8px 35px ; width:90px; color:#fefefe; font-size:14px; background:url(../images/zkapp/icon-ios2.png) no-repeat 8px center; border:solid 1px #fff; border-radius:4px; -webkit-border-radius:4px; text-align:right}
.ewmbg{position:absolute; left:50%;}

/*结束HTML样式*/

/*css3动画Start*/
.iphoneimg2, .iphoneimg3, .right-img1 img, .app-texiao1, .app-texiao2, .navInfo{ visibility:hidden;}
.iphone1 img{ animation:iphoneimg1 1.7s; -webkit-animation:iphoneimg1 1.7s;}
.tringle1 img{ animation:tringleimg 1.7s; -webkit-animation:tringleimg 1.7s;}
.animate1 .iphoneimg2, .animate2 .iphoneimg3{ visibility:visible; animation:iphoneimg2 1.7s; -webkit-animation:iphoneimg2 1.7s;}
.animate1 .right-img1 img{ visibility:visible; padding-bottom:440px; animation:manrotate 1s; -webkit-animation:manrotate 1s;}

.animate2 .app-texiao1{ visibility:visible;}
.animate2 .htiao1{ animation:htiao1 1.2s; -webkit-animation:htiao1 1.2s;}
.animate2 .htiao2{ animation:htiao1 .7s; -webkit-animation:htiao1 .7s;}
.animate2 .htiao1_2{ animation:htiao2 1.2s; -webkit-animation:htiao2 1.2s;}
.animate2 .htiao2_2{ animation:htiao2 .7s; -webkit-animation:htiao2 .7s;}
.animate2 .cicle1{ animation:cicle1 1.3s; -webkit-animation:cicle1 1.3s;}
.animate2 .cicle2{ animation:cicle2 1.3s; -webkit-animation:cicle2 1.3s;}
.animate2 .cicle3{ animation:cicle3 1.3s; -webkit-animation:cicle3 1.3s;}
.animate2 .cicle4{ animation:cicle4 1.3s; -webkit-animation:cicle4 1.3s;}
.animate2 .cicle5{ animation:cicle5 1.3s; -webkit-animation:cicle5 1.3s;}
.animate2 .cicle6{ animation:cicle6 1.3s; -webkit-animation:cicle6 1.3s;}

.animate3{ visibility:visible;}
.animate3 .star1 img, .animate2 .star2 img, .animate2 .star3 img { vertical-align:middle; animation:star1 1.3s; -webkit-animation:star1 1.3s;}
.animate3 .man1{ animation:man1 1.3s; -webkit-animation:man1 1.3s;}
.animate3 .man2 img{ animation:man2 1.3s; -webkit-animation:man2 1.3s;}
.animate3 .man3{ animation:man3 1.3s; -webkit-animation:man3 1.3s;}

.animate4 .navInfo{ visibility:visible;}
.animate4 .navimg1{ animation:nav1 1.7s; -webkit-animation:nav1 1.7s;}
.animate4 .navimg2{ animation:nav2 1.9s; -webkit-animation:nav2 1.9s;}
.animate4 .navimg3{ animation:nav3 1.4s; -webkit-animation:nav3 1.4s;}
.animate4 .navimg4{ animation:nav4 1.6s; -webkit-animation:nav4 1.6s;}
.animate4 .navimg5{ animation:nav5 1.5s; -webkit-animation:nav5 1.5s;}
.animate4 .navimg6{ animation:nav6 1.5s; -webkit-animation:nav6 1.5s;}
.animate4 .navimg7{ animation:nav7 1.3s; -webkit-animation:nav7 1.3s;}
.animate4 .navimg8{ animation:nav8 1.6s; -webkit-animation:nav8 1.6s;}
.animate4 .navimg9{ animation:nav9 1.9s; -webkit-animation:nav9 1.9s;}

.animate4 .iphoneimg4{animation:iphoneimg4 .9s; -webkit-animation:iphoneimg4 .9s;}
.animate4 .iphoneimg4btm{animation:iphoneimg4btm .9s; -webkit-animation:iphoneimg4btm .9s;}